<template>
  <div id="subpage" v-loading="loading">
    <el-col :span="24" class="warp-breadcrum">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item>
          <b>首页</b>
        </el-breadcrumb-item>
        <el-breadcrumb-item>密码设置</el-breadcrumb-item>
      </el-breadcrumb>
    </el-col>
    <div class="content">
      <div class="xcx-head">
        <span class="title">密码设置</span>
      </div>
      <div class="xcx-content">
        <el-form ref="form_data" :model="form_data" :rules="rules" label-width="160px" style="width: 80%">
          <el-form-item label="旧密码：" prop="oldPwd">
            <el-input v-model="form_data.oldPwd" placeholder="请输入原来的密码"></el-input>
          </el-form-item>
          <el-form-item label="新密码" prop="newPwd">
            <el-input v-model="form_data.newPwd" placeholder="请输入新密码"></el-input>
          </el-form-item>
          <el-form-item label="重复密码" prop="confirm">
            <el-input v-model="form_data.confirm" placeholder="请再次输入新密码"></el-input>
          </el-form-item>
          <el-form-item class="mar_T_50">
            <el-button type="primary" @click="save()">确认修改</el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      loading: true,
      form_data: {
        oldPwd: "",
        newPwd: "",
        confirm: "",
      },
      id: "",
      rules: {
        oldPwd: [
          { required: true, message: "请输入原来的密码", trigger: "blur" },
        ],
        newPwd: [
          {
            required: true,
            message: "请输入新密码",
            trigger: "blur",
          },
        ],
        confirm: [
          {
            required: true,
            message: "请再次输入新密码",
            trigger: "blur",
          },
        ],
      },
    };
  },
  mounted() {
    this.loading = false;
  },
  methods: {
    save() {
      const that = this;
      that.$refs.form_data.validate((valid) => {
        if (!valid) return that.$message.warning("请完整填写内容!");
        var formData = {};
        formData = that.form_data;
        var url = "/config/password";
        that.axios.post(url, formData).then((res) => {
          console.log(res);
          if (res.code == 200) {
            that.$message.success("修改成功,下次登录请使用新密码。");
            that.$router.push("/index");
          } else {
            that.$message.error(res.msg);
          }
        });
      });
    },
  },
};
</script>
